// import * as echarts from '../../components/ec-canvas/echarts';
var chart = require("../../utils/chart.js");

Page({
  /**
   * 页面的初始数据
   */
  data: {
    // ec: {
    //   onInit: initChart
    // },
    listData: [{
        "col1": "总观看人数",
        "col2": "人",
        "col3": "9660"
      },
      {
        "col1": "平均观看时长",
        "col2": "分钟",
        "col3": "9"
      },
      {
        "col1": "评论次数",
        "col2": "次",
        "col3": "1020"
      },
      {
        "col1": "进商详人数",
        "col2": "人",
        "col3": "705"
      },
      {
        "col1": "加购次数/人数",
        "col2": "人",
        "col3": "400/350"
      },
      {
        "col1": "成交金额",
        "col2": "元",
        "col3": "10800"
      },
      {
        "col1": "新增粉丝数",
        "col2": "人",
        "col3": "180"
      },

    ]
  },

  onLoad: function (options) {
    console.log('载入');

    chart.draw(this, 'canvas5', {
      // title: {
      //   text: "导购机器人推送商品随时间分布（单位：个/min）",
      //   color: "#333333"
      // },
      xAxis: {
        data: ['00:00', '03:00', '06:00', '09:00', '12:00', '15:00', '18:00', '21:00']
      },
      series: [

        {
          name: "点击商详次数",
          category: "line",
          data: [379, 435, 438, 300, 548, 927, 1383, 735]
        },
        {
          name: "评论数",
          category: "line",
          data: [123, 234, 123, 345, 453, 567, 643, 495]
        },
        {
          name: "成交订单量",
          category: "line",
          data: [234, 375, 238, 100, 228, 447, 643, 595]
        },

      ]
    });
  },
  onHighLightClick: function () {
    
  wx.navigateTo({
    url: '../heightlight/heightlight',
  })

    },

  onSaveClick: function () {}


})

// function initChart(canvas, width, height) {
//   const chart = echarts.init(canvas, null, {
//     width: width,
//     height: height
//   });
//   canvas.setChart(chart);

//   var option = {
//     //定义图标的标题和颜色
//     // title: {
//     //   text: '今日访问量',
//     //   left: 'center'
//     // },
//     color: ["#37A2DA"],
//     //定义你图标的线的类型种类
//     legend: {
//       data: ['A'],
//       top: 50,
//       left: 'center',
//       backgroundColor: 'red',
//       z: 100
//     },
//     grid: {
//       containLabel: true
//     },
//     //当你选中数据时的提示框
//     tooltip: {
//       show: true,
//       trigger: 'axis'
//     },
//     //	x轴
//     xAxis: {
//       type: 'category',
//       boundaryGap: false,
//       data: ['一', '二', '三', '四', '五', '六', '日', '一', '二', '三'], //x轴数据
//       // x轴的字体样式
//       axisLabel: {
//         show: true,
//         textStyle: {
//           color: '#000',
//           fontSize: '14',
//         }
//       },
//       // 控制网格线是否显示
//       splitLine: {
//         show: true,
//         //  改变轴线颜色
//         lineStyle: {
//           // 使用深浅的间隔色
//           color: ['#aaaaaa']
//         }
//       },
//       // x轴的颜色和宽度
//       axisLine: {
//         lineStyle: {
//           color: '#000',
//           width: 1, //这里是坐标轴的宽度,可以去掉
//         }
//       }
//       // show: false //是否显示坐标
//     },
//     yAxis: {
//       x: 'center',
//       type: 'value',
//       //网格线
//       splitLine: {
//         lineStyle: {
//           type: 'dashed'
//         }
//       },
//       // show: false
//     },
//     series: [{
//       name: 'A',
//       type: 'line',
//       smooth: true,
//       data: [15, 2, 30, 16, 10, 17, 15, 22, 27, 9]
//     }]
//   };
//   chart.setOption(option);
//   return chart;
// }